/*
 * @Author: Drc
 * @Date: 2021-09-16 13:51:46
 * @LastEditTime: 2021-09-16 14:05:10
 * @LastEditors: Drc
 */
import ConfirmBtn from '@path/components/ConfirmBtn'
import {px2dp} from '@path/config/system'
import React, {memo} from 'react'
import {View} from 'react-native'
import Pop, {PopProps} from './index'
import _ from 'lodash'
import Theme from '@path/config/theme'

interface ActionSheetPopProps extends PopProps {
  buttonList: {text: string; onPress: () => any; Theme?: 'main' | 'minor'}[]
}

class ActionSheetPop extends Pop<ActionSheetPopProps> {
  static defaultProps: ActionSheetPopProps = {
    ...super.defaultProps,
    animationIn: 'slideInUp',
    animationOut: 'slideOutDown',
    style: {justifyContent: 'flex-end'},
  }
  renderContent = () => {
    return (
      <View
        style={{
          maxHeight: '60%',
          alignSelf: 'flex-end',
          width: '100%',
          backgroundColor: Theme.getThemeColor('bg'),
          paddingTop: px2dp(30),
          paddingBottom: px2dp(54),
          flex: 0,
          alignItems: 'center',
        }}>
        {this.props.buttonList?.map((item) => {
          return (
            <ConfirmBtn
              key={item.text}
              style={{marginBottom: px2dp(14)}}
              btnTheme={item.Theme === 'main' ? 'Main' : 'Minor'}
              text={item.text}
              onPress={() => {
                typeof item.onPress === 'function' && item.onPress()
              }}
            />
          )
        })}
      </View>
    )
  }
}

export default memo(ActionSheetPop, (prev, next) => _.isEqual(prev.isVisible, next.isVisible))
